<?php
define('IN_UCHOME', '1');
include_once '../common.php';
include_once './apishow-common.php';

$type = $_REQUEST['type'] ? $_REQUEST['type'] : "normal";
$page = empty($_GET['page']) ? 1 : intval($_GET['page']);
if ($page < 1) {
	$page = 1;
}
// 分页
$perpage = 24;
$perpage = mob_perpage($perpage);

$count = getcount("pic");
$maxpage = $count % $perpage == 0 ? intval($count / $perpage) :intval( $count / $perpage + 1);

$page = $page >= $maxpage ? $maxpage : $page;

$start = ($page - 1) * $perpage;

// 检查开始数
ckstart($start, $perpage);
$list = array();
$theurl = "index.php?type=$type";

$list = array();
$query = $_SGLOBAL['db']->query("SELECT * FROM " . tname('pic') . " order by picid  LIMIT $start,$perpage");
while ( $value = $_SGLOBAL['db']->fetch_array($query) ) {
	$value['src'] = $_SC['attachurl'] . $value['filepath'];
// 	$value['thumbArr'] = unserialize($value['thumb']);
// 	$ext = $value['thumbArr']['800'] ? ".800.jpg" : "";
// 	$value['800'] = $value['src'] . $ext;
// 	$thumbext = $value['thumbArr']['thumb'] ? ".thumb.jpg" : "";
// 	$value['thumb'] = $value['src'] . $thumbext;
	$list[] = $value;
}
// print_r($list);exit;
$multi = multi($count, $perpage, $page, $theurl);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>网络图片收集</title>
<link rel="stylesheet" type="text/css"
	href="./fancybox/jquery.fancybox.css" media="screen" />
<link rel="stylesheet" type="text/css"
	href="./fancybox/jquery.fancybox-thumbs.css" />
	
<link href="./css.css" rel="stylesheet" type="text/css" />
<link href="./fancybox/pagination.css" rel="stylesheet" type="text/css" />

<style type="text/css">
#wrapper .selected {
	border: 1px solid red;
}
.imgWrap_list {
    background: url("./images/ext_img_uploading.gif") no-repeat scroll center center #FFFFFF;
    border: 1px solid #CCCCCC;
    width: 800px;
    height: 800px;
    margin: 0px 5px 5px 0;
    position: relative;
    float:left;
}
</style>
<script type="text/javascript" src="./fancybox/jquery.min.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox.change.js"></script>

<script type="text/javascript"
	src="./fancybox/jquery.fancybox-thumbs.js"></script>
<script type="text/javascript" src="./jquery.cookie.js"></script>
<script type="text/javascript">
	
	//所有图片自动缩放
	function initProductImgAdapt(class_,wrap_w,wrap_h){
		
		$("."+class_+" a img").each(function(){			
	    var this_ = $(this);
		var img = new Image();
		img.src = $(this).attr("src");
		var wrapWidth = wrap_w?wrap_w:150;
		var wrapHeight = wrap_h?wrap_h:150;
		var marginLeft = 0;
		var marginTop = 0;
		var width_ = height_ = 0;
		img.onload = function () {
			var width  = this.width;
			var height = this.height;
	
			var  scale_org = wrapWidth/wrapHeight;
	
			if (wrapWidth / width > wrapHeight / height)
			{
				height_ = wrapHeight;
				width_ = width  * wrapHeight/height;
			} else
			{
				width_ = wrapWidth;
				height_ = height * wrapWidth/width;
			}
			marginLeft = (wrapWidth-width_)/2+1;
			marginTop = (wrapHeight-height_)/2+1;
			//alert(height_);
			this_.get(0).style.width=width_+"px";
			this_.get(0).style.height=height_+"px";
			this_.get(0).style.marginLeft=marginLeft+"px";
			this_.get(0).style.marginTop=marginTop+"px";
			this_.get(0).style.display="";
		};            
	});
	}
	var type = '<?php echo $type?>';
	var index = -1;
	var backPics = [];
	function picdel(picid,obj){	
		$.ajax({
			   type: "POST",
			   url: "ajax.php?op=delpic",
			   data: {"picid":picid},
			   dataType:'json',
			   success: function(json){
			     if(json.status==1){	
			    	 if(type=='list'&&obj){
			    		 obj.parent().remove();
				     }else{
						window.location.href = window.location.href;	
				     }				    				    
			     }else{
					alert(json.err);
			     }
			   }
			});
	}
	function fancyPicdel(){
		if($("#allImgWrap .selected").length<1){
			return;
		}
		if(!window.confirm("删除选中图片？")){
			return false;
		}
		
		var picid_ = $("#allImgWrap .selected").attr("picid");
		$.ajax({
			   type: "POST",
			   url: "ajax.php?op=delpic",
			   data: {"picid":picid_},
			   dataType:'json',
			   success: function(json){
				
			     if(json.status==1){	
					$("#imgWrap"+picid_).remove();
					//if(backPics.length<2){						
						getBackPic();						
					//}
					if(backPics.length>0){
						var pic = backPics.pop();	
						var html = "";
						html+='<div id="imgWrap'+pic.picid+'" picid="'+pic.picid+'" class="imgWrap">';
						html+='<a picid="'+pic.picid+'" class="fancybox" href="'+pic.src+'" data-fancybox-group="gallery" title="">';
						html+='<img style="width:150px;height:150px;" src="'+pic.src+'" alt="">';
						html+='</a>';
						html+='<img picid="'+pic.picid+'" class="picdel" src="../api/image/api-close.jpg" title="删除" alt="删除">';
						html+='<p>'+pic.dateline+'</p>';
						html+='<input type="checkbox" value="'+pic.picid+'" name="picid[]" class="picid">';
						html+='</div>';						
						$("#allImgWrap").append(html);					
					}
					
					if($(".imgWrap").length<1){
						window.location.href = window.location.href ;
						return;
					}
					index = index>$(".imgWrap").length-1?$(".imgWrap").length-1:index;
					$(".imgWrap").removeClass("selected");
					$(".imgWrap").eq(index).addClass("selected");				    	    				    
			     }else{
					alert(json.err);
			     }
			   }
			});
	}

	function getBackPic(){	
		$.ajax({
		   type: "POST",
		   url: "ajax.php?op=getpic&start=<?php echo $start+$perpage;?>&page=<?php echo $page;?>&type=<?php echo $type;?>&pageSize=<?php echo $perpage;?>",
		   data: {},
		   dataType:'json',
		   success: function(json){
			   backPics = [];
			   for(var pic in json.data){
				   backPics.push(json.data[pic]);
				}
				$("#pagiWrap").html(json.pagination);
		   }
		});
	}
	
	$(function(){
		getBackPic();
		
		var fancyboxPlay = false;
		if($.cookie("fancyboxPlay")&&$.cookie("fancyboxPlay")=="true"){
			$("#fancyboxPlay").attr("checked",true);
			fancyboxPlay = true;
		}
		
		$('.fancybox').fancybox({
			prevEffect	: 'none',
			nextEffect	: 'none',
			//loop : false,
			autoPlay : fancyboxPlay,
			
			helpers	: {
				title	: {
					type: 'outside'
				},
				overlay	: {
					opacity : 0.8,
					css : {
						'background-color' : '#000'
					}
				},
				thumbs	: {
					width	: 50,
					height	: 50
				}
			}
		});	
		$("#fancyboxOpen").click(function(){
			var this_ = $(this);
			$.cookie("fancybox", this_.is(":checked"));
		});
		$("#fancyboxOpenLabel").click(function(){
			//var this_ = $(this);
			var ischecked = !$("#fancyboxOpen").is(":checked");
			$("#fancyboxOpen").attr("checked",ischecked);
			$.cookie("fancybox", ischecked);
		});

		$("#fancyboxPlay").click(function(){
			var this_ = $(this);
			$.cookie("fancyboxPlay", this_.is(":checked"));
		});

		$("#fancyboxPlayLabel").click(function(){
			//var this_ = $(this);
			var ischecked = !$("#fancyboxPlay").is(":checked");
			$("#fancyboxPlay").attr("checked",ischecked);
			$.cookie("fancyboxPlay", ischecked);
		});
		if($.cookie("fancybox")&&$.cookie("fancybox")=="true"){
			$("#fancyboxOpen").attr("checked",true);
			$('.fancybox').eq(0).click();
		}
				
		$("body").keyup(function(e){
			var key = e.which;		
			//alert(key);	
			if(key==68&&$("#pagenavi .current").next("a").length>0){
				window.location.href = $("#pagenavi .current").next("a").attr("href");
			}else if(key==65&&$("#pagenavi .current").prev("a").length>0){
				window.location.href = $("#pagenavi .current").prev("a").attr("href");
			}else if(key==75){
				index++;
				index = index>$(".imgWrap").length-1?0:index;
				$(".imgWrap").removeClass("selected");
				$(".imgWrap").eq(index).addClass("selected");
				
			}else if(key==74){
				index--;
				index= index<0?$(".imgWrap").length-1:index;
				//alert(index);
				$(".imgWrap").removeClass("selected");
				$(".imgWrap").eq(index).addClass("selected");	
			}else if(key==46){
				fancyPicdel();				
			}
		});

		$(".picdel").live("click",function(){
			if(!window.confirm("删除该图片？")){
				return false;
			}
			picid = $(this).attr("picid");
			var this_ = $(this);
			picdel(picid,this_);

		});

		
		$("#ckAll").click(function(){
			var this_ = $(this);
			$(".picid").attr("checked",this_.is(":checked"));
			
		});
		$("#ckAllLabel").click(function(){
			//$("#ckAll").click();
			var ischecked = !$("#ckAll").is(":checked");
			$("#ckAll").attr("checked",ischecked);
			$(".picid").attr("checked",ischecked);
		});
		$("#batchDel").click(function(){
			var picid = [];
			$(".picid:checked").each(function(i){
				var this_ = $(this);
				picid[i] = this_.val();
				
			});
			if(picid.length<=0){
				alert("请选择图片");
				return false;
			}
			if(!window.confirm("删除选中图片？")){
				return false;
			}
			
			
			

			picdel(picid);
		});
	})
	function loginout(){
		$.ajax({
		   type: "POST",
		   url: "ajax.php?op=logout",
		   dataType:'html',
		   success: function(json){		    	 
				window.location.href = "login.html";
		   }
		});
	}
</script>
</head>
<body>
	<div id="wrapper">
		<div style="position: relative; padding: 5px 0;">
			<input type="checkbox" id='ckAll'
				style='position: absolute; top: 9px; left: 0px;'> <label
				id='ckAllLabel' style='position: absolute; top: 8px; left: 20px;'>全选</label>
			<button id="batchDel" style='margin: 0 0 0 60px;'>批量删除</button>
			<input type="checkbox" id='fancyboxOpen'
				style='position: absolute; top: 9px; right: 130px;'> <label
				id='fancyboxOpenLabel'
				style='position: absolute; top: 8px; right: 20px;'>默认开启fancybox</label>
			<input type="checkbox" id='fancyboxPlay'
				style='position: absolute; top: 9px; right: 270px;'> <label
				id='fancyboxPlayLabel'
				style='position: absolute; top: 8px; right: 160px;'>自动播放fancybox</label>
		</div>
		<div id="allImgWrap">
		<?php if($type=="list"):?>
		<?php foreach($list as $v){?>
			<div class="imgWrap_list" picid="<?php echo $v['picid']?>">
				<a title="<?php echo $v['title'];?>" data-fancybox-group="gallery"
					href="<?php echo $v['src']?>" class="fancybox"
					picid="<?php echo $v['picid']?>"> <img alt=""
					src="<?php echo $v['src']?>" style="width:800px;height:800px;">
				</a> <img alt="删除" title="删除" src="../api/image/api-close.jpg"
					class='picdel' picid="<?php echo $v['picid']?>"> <input
					type="checkbox" class='picid' name='picid[]'
					value='<?php echo $v['picid'];?>' />
			</div>
		<?php }?>
		<div style='clear:both;'></div>
		<script type="text/javascript">
			$(function(){
				initProductImgAdapt('imgWrap_list',$('.imgWrap_list:eq(0)').width() , $('.imgWrap_list:eq(0)').height());
			});
		</script>
		<?php else:?>	
		<?php foreach($list as $v){?>
			<div class="imgWrap" picid="<?php echo $v['picid']?>"
				id="imgWrap<?php echo $v['picid']?>">
				<a title="<?php echo $v['title'];?>" data-fancybox-group="gallery"
					href="<?php echo $v['src']?>" class="fancybox"
					picid="<?php echo $v['picid']?>"> <img alt=""
					src="<?php echo $v['src']?>" style="width:150px;height:150px;">
				</a> <img alt="删除" title="删除" src="../api/image/api-close.jpg"
					class='picdel' picid="<?php echo $v['picid']?>">
				<p><?php echo sgmdate("Y-m-d",$v['dateline']);?></p>
				<input type="checkbox" class='picid' name='picid[]'
					value='<?php echo $v['picid'];?>' />
			</div>
		<?php }?>
		<script type="text/javascript">
			$(function(){
				initProductImgAdapt('imgWrap',150,150);
			});
		</script>
		<?php endif;?>		
		</div>
		<div id='pagiWrap'>
		<?php echo $multi;?>	
		</div>


		<div>
			<a href="picupload.php">图片上传</a>&nbsp; <a
				href="index.php?page=<?php echo $page;?>">首页缩略图</a>&nbsp; <a
				href="index.php?type=list&page=<?php echo $page;?>">首页大图列表</a>&nbsp;
			<a href="javascript:;" onclick='loginout();'>退出</a>
		</div>
	</div>
</body>
</html>